﻿<div class="content-wrap research-pi">
    <div ng-include="'Views/Research/Common/ResearchMenu.html'"></div>
    <div class="clear">&nbsp;</div>
    <div class="content">
        <div class="content-pad">
            <div class="title-section">
                <div sustainalytics-company-research></div>
                <div style="position: absolute; right: 145px; z-index: 99; {{PICompanyDetailsCtrl.company.isCoverageEntity ? 'top: 114px;' : 'top: 0;'}}">
                    <input type="button" ng-click="PICompanyDetailsCtrl.DownloadPIReport()" value="Download Report" class="btn-green {{!PICompanyDetailsCtrl.GetPDFDownloadEnabled() && 'disabled' || ''}}"
                           ng-disabled="!PICompanyDetailsCtrl.GetPDFDownloadEnabled()" style="min-width: 135px; width: 135px; margin-top: 0;" />
                </div>
            </div>     
            <div class="clear">&nbsp;</div><br />
            <div ng-show="PICompanyDetailsCtrl.showIndicatorBubbles">
                <ul class="pi-indicators-bubbles" ng-hide="PICompanyDetailsCtrl.noClaims || PICompanyDetailsCtrl.notFoundMessage !== ''">
                    <li ng-repeat="i in PICompanyDetailsCtrl.piIndicators">
                        <img ng-src="../../../Content/Images/icn-pi-{{i.symbol}}_{{PICompanyDetailsCtrl.GetIndicatorIconState(i.symbol)}}.png" width="80" height="80" />
                        <div class="pi-indicators-bubbles-text">{{i.name}}</div>
                    </li>
                </ul>
                <div class="clear">&nbsp;</div>
                <br />
            </div>

            

            <div ng-repeat="companyIndicator in PICompanyDetailsCtrl.piAssessmentIndicators" class="repeat-animation">
                <div ng-if="PICompanyDetailsCtrl.hasIndicatorClaim(companyIndicator.symbol)">
                    <div class="left-content">
                        <div class="title-18-bold float160">{{companyIndicator.name}}</div>
                        <div class="pi-icon-float">
                            <img ng-src="../../../Content/Images/icn-pi-{{companyIndicator.symbol}}_on.png" />
                        </div>
                        <div class="clear">&nbsp;</div>
                    </div>
                    <div class="right-content">
                        <div ng-repeat="indicatorAssessment in companyIndicator.indicatorAssessments">
                            <div class="title-18-bold" style="padding-bottom: 5px;">
                                {{indicatorAssessment.categorySymbolDescription}}
                            </div>
                            <br />
                            <div class="title-18-bold" style="padding-bottom: 10px;" ng-if="indicatorAssessment.hasLevelOfInvolvement">
                                Range: {{indicatorAssessment.levelOfInvolvement.text}}
                            </div>
                            <div class="title-18-bold" style="padding-bottom: 10px;" ng-if="indicatorAssessment.hasOwnershipPercent">
                                Ownership: {{indicatorAssessment.ownershipPercent * 100}} %
                            </div>
                            <div class="research-expand" style="line-height: 22px; font-size: 14px; padding-top: 0px;">
                                {{indicatorAssessment.standardAnalysis}}
                            </div>
                            <br />
                        </div>
                    </div>
                    <div class="clear">&nbsp;</div>
                    <br />
                    <br />
                </div>
            </div>
                        
            <div class="title-section">
                <div>
                    <input type="button" ng-click="PICompanyDetailsCtrl.LoadMoreIndicators()" value="Show more indicators" ng-if="PICompanyDetailsCtrl.GetShowMoreEnabled()" class="btn-green {{!PICompanyDetailsCtrl.GetShowMoreEnabled() && 'disabled' || ''}}" ng-disabled="!PICompanyDetailsCtrl.GetShowMoreEnabled()" style="min-width:150px; width:150px;" />
                </div>
            </div>
            <div class="gray-bg-top" style="margin-top: 8px;" ng-show="(PICompanyDetailsCtrl.notFoundMessage !== undefined && PICompanyDetailsCtrl.notFoundMessage !== null && PICompanyDetailsCtrl.notFoundMessage !== '') || PICompanyDetailsCtrl.noClaims == true">
                <div ng-show="PICompanyDetailsCtrl.notFoundMessage !== null && PICompanyDetailsCtrl.notFoundMessage !== ''">
                    <span class="title-black-bold">{{PICompanyDetailsCtrl.notFoundMessage}}</span>
                </div>

                <div ng-show="PICompanyDetailsCtrl.noClaims == true">
                    <span class="title-black-bold">You do not have access to Product Involvement research for this company.</span>
                </div>
            </div>

        </div>
    </div>
</div>